import React from 'react'
// ===================================================================== Temp
import TableModal from '#cpt/temp/TableModal'
import TableControls from '#cpt/temp/TableControls'
// ===================================================================== global declare
const { $fn, $Lazy } = window

const PreviewImage 	= $Lazy.state(()=>import('#private/pages/preview-image'))
// ===================================================================== component
class Index extends React.Component{
	state = {
		data: [],
		pag:{}
	}
	
	model = {}
	
	open = ({ uuid }) => {
		this.modal.open()
		this.query = { contract_id: uuid }
		this.fetch()
	}
	
	// paging
	fetch = () => $fn.fetch.call(this,'bs-file/index')
	
	// 表单
	cols = [
		{ title: '上传时间',			dataIndex: 'update_at', 					...$fn.table.time },
		{ title: '上传人',			dataIndex: 'upload_user', 					...$fn.table.name },
		TableControls.controls.call(this, { width: 100 })
	]
	
	// 表格操作按钮
	table_controls = (text, { file_name }) => {
		return [
			TableControls.click.call(this,'查看', ()=>{
				if(file_name.indexOf('png') >= 0 || file_name.indexOf('jpg') >= 0 || file_name.indexOf('jpeg') >= 0 ){
					this.previewRef.open(file_name)
				}else{
					window.open(file_name)
				}
			})
		]
	}
	
	render(){
		return (
			<>
				{ TableModal.call(this,{ title:'查看附件', width:'50%', minWidth:700, height:500, noSubmit:true}) }
				{/* 查看图片 */}
				<PreviewImage onRef={ref=>this.previewRef = ref} />
			</>
		)
	}
}

export default Index